<template>
    <div>
        <center>
            <h1>V-Model</h1>
            <!-- 所谓v-model=v-bind(value)+v-on(input)，v-model在vue事实上只能绑定表单元素，
        而表单元素其实只有3个，input、select、textarea -->
            <!-- input和change之间的差异与区别是什么？ -->
            <!-- checkbox、radio它们里面是value值吗？不是，它们是checked，它们里面是input事件吗？不是，是change事件 -->
            {{ title }}
            <input
                v-bind:value="title"
                v-on:input="title = $event.target.value"
            />
        </center>
    </div>
</template>

<script>
export default {
    data() {
        return {
            title: 'v-model的理解',
        };
    },
};
</script>

<style></style>
